﻿<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="myfood.aspx.cs" Inherits="weikebuluo.wxgzpt.wechat.orderfood.myfood" %>
    <html lang="zh-CN">
    <head>
<link rel="stylesheet" type="text/css" href="styles/css/spoutlet/wei_canyin.css" media="all">
<link rel="stylesheet" type="text/css" href="styles/css/spoutlet/wei_dialog.css" media="all">
<link href="styles/css/plugins/datepicker/datepicker_canyin.css" rel="stylesheet" type="text/css"  media="all" />
<script type="text/javascript" src="styles/src/jQuery.js"></script>
<script type="text/javascript" src="styles/src/spoutlet/wei_webapp_v2_common.js"></script>
<script src="../../../Scripts/Su.common.js" type="text/javascript"></script>
<script src="styles/src/plugins/datepicker/bootstrap-datepicker_canyin.js" type="text/javascript"></script>
<title>我的菜单</title>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0">
    <meta name="format-detection" content="telephone=no">
</head>
<body id="page_intelOrder" class="myOrderCon">
    <style>
    .btn_common{
        font-size:12px;z
        padding: 5px 8px;
        border: 0;
        border-radius: 2px;
        cursor: pointer;
        background-color: #2ec366;
        color: #fff;
    }
    .dish_item textarea{
        padding: 8px;
        background: #eaeaea;
        border-radius: 12px;
        border: 1px solid #dedede;
        outline: none;
        resize: none;
        width: 100%;
        -webkit-box-sizing: border-box;
        box-shadow: none;
        display:none;
    }
    .dish_item{
        height:45px!important;
    }
    .dish_item.on{
        height:97px!important;
    } .dish_item.on textarea{
        margin-top:3px;
        display:block;
    }
</style>



<header style="padding-top:20px;">
    <span class="pCount" style="">已点<l style="color:red" id="countnums" nums="<%=count%>"><%=count%></l>个菜</span>
    <label><i>共计：</i><b class="duiqi" id="total">5.00</b><b class="duiqi">元</b></label>
</header>
<form id="form1" action="myfood.aspx" method="post" target="hide">
<section style="margin-bottom:10px;">
    <article>
        <h2>我的菜单
            <%--<button class="btn_add emptyIt" id="clearBtn" onclick="clearAll();">清空</button>--%>
            <%--<button class="btn_add" onclick="location.href='choosefood.aspx?sid=<%=Request.QueryString["sid"] %>&wxid=<%=Request.QueryString["wxid"] %>'">+加菜</button>--%>
        </h2>
        <ul id="myorder" class="myorder"></ul>
    </article>
</section>
<section style="margin-bottom:40px;">
    <article>

            <table class="table_book">
                <tbody><tr>
                    <td width="80px" style="width:80px;">手机号码：</td>
                    <td colspan="2"><input type="tel" id="tel" name="tel" value="" maxlength="11" placeholder="(必填*)请输入您的手机号码" style="width:180px;"></td>
                </tr>
                <tr>
                    <td style="width:80px;">用户姓名：</td>
                    <td style="width:50%;">
                        <input type="text" name="guest_name" id="guest_name" value="" placeholder="(必填*)请输入您的真是姓名" maxlength="10" style="width:100px;">
                    </td>
                    
                </tr>

                                <tr>
                    <td style="width:80px;vertical-align:top;line-height:25px;">地址：</td>
                    <td colspan="2">
                        <textarea name="remark" style="width:180px;" style="height:60px;" maxlength="100"></textarea>
                    </td>
                </tr>
            </tbody></table>
            <footer>
            <%if (!string.IsNullOrEmpty(Request.QueryString["sid"]))
              { %>
              <input type="hidden"  name="sid" value="<%=Request.QueryString["sid"] %>" />
              <input type="hidden"  name="wxid" value="<%=Request.QueryString["wxid"] %>" />
              <%} %>
            <input type="hidden"  name="action" value="add" />
            <input type="hidden" id="all"  name="all" value="" />
                <input type="submit" value="立即预定" class="btn_2" id="submit_form">
                
            </footer>
    </article>
    
</section>
</form>

<div id="footer_menu" class="footer footer_menu">
            <ul class="clear"  style="position: inherit;">
                                <li><a href="choosefood.aspx?sid=<%=Request.QueryString["sid"] %>&wxid=<%=Request.QueryString["wxid"] %>" class="onactive"><span class="icons icons_2"></span><label>点菜</label></a></li>
                                <li><a href="myorder.aspx?sid=<%=Request.QueryString["sid"] %>&wxid=<%=Request.QueryString["wxid"] %>" ><span class="icons icons_3"></span><label>我的订单</label></a></li>
                <li><a href="javascript:void(0);" id="my_menu"><span class="icons icons_5"><label id="num" class="num">1</label></span></a></li>
            </ul>
        </div>
        <script>
            var footer = document.getElementById("footer_menu");
            var evtObj = {
                handleEvent: function (evt) {
                    if ("A" == evt.target.tagName) {
                        evt.target.classList.toggle("on");
                    }
                }
            }
            footer.addEventListener("touchstart", evtObj, false);
            footer.addEventListener("touchend", evtObj, false);
        </script>
<script>    var pageName = 'menuFilled';</script>
<script>
    window.addEventListener("DOMContentLoaded", function () {
        getAllMenu();
    }, false);
    //
    function getAllMenu() {
        MLoading.show('加载中');
        var params = {}
        $.ajax({
            url: 'myfood.aspx?action=list&sid=' + getQueryString("sid") + '&wxid=' + getQueryString("wxid"),
            type: "post",
            success: function (res) {
                MLoading.hide();
                res = eval("(" + res + ")");
                window.res = {
                    data: res
                }
                switchMenu();
            }
        });
    }
    
    function switchMenu() {
        var TPL = '<li class="dish_item">\
                    <span class="dishName">{foodlist_name}</span>\
                    <i>{foodlist_price}元/份</i>\
                    <section class="bbox" dishname="{foodlist_name}" onclick="changeCount(this, event, {foodlist_id});">\
                    <input type="hidden"  name="orderfood_id" value="{orderfood_id}" />\
                        <input class="btn-reduce" type="button" value="-">\
                        <input class="numBox" name="numBox" type="text" value="{orderfood_num}" price="{foodlist_price}" readonly="readonly">\
                        <input type="button" class="btn-plus" value="+">\
                    </section>\
                    </li>';
        var myorder = document.getElementById("myorder");
        var totalPrice = 0;
        myorder.innerHTML = iTemplate.makeList(TPL, window.res.data, function (k, v) {
            if (v.foodlist_price) {

                v.price = v.foodlist_price;
            }
            totalPrice += parseFloat(v.price) * parseInt(v.orderfood_num);
            return {
                description: v.description || ""
            }
        });
        document.getElementById("total").innerHTML = (totalPrice).toFixed(2);
        $("#all").val(totalPrice/2);
    }



    function changeCount(thi, evt, dishes_id) {
        if ("button" == evt.target.type) {
            var counter = thi.querySelectorAll("input[name='numBox']")[0];

            var val = parseInt(counter.value);

            var countnums = parseInt($("#countnums").attr("nums"));
            if ("btn-reduce" == evt.target.className) {
                val--;
            } else {
                val++;
            }
            counter.value = Math.max(0, val);
            if (val >= 0) {
                if ("btn-reduce" == evt.target.className) {
                    var num = countnums - 1;
                } else {
                    var num = countnums + 1;
                }
                document.getElementById("countnums").innerHTML = num;
                $("#countnums").attr("nums", num);
            }
            var totalPrice = 0;
            for (var i = 0, ci; ci = window.res.data[i]; i++) {
                if (dishes_id == ci.foodlist_id) {
                    ci.orderfood_num = counter.value;
                    //break;
                }
                totalPrice += parseFloat(ci.foodlist_price) * parseInt(ci.orderfood_num);
            }
            document.getElementById("total").innerHTML = (totalPrice).toFixed(2);
            $("#all").val(totalPrice);
            //switchMenu();
        }
    }
//    function clearAll() {
//        MDialog.confirm(
//                '', '是否清空菜单？', null,
//                '确定', function () {
//                    $.ajax({
//                        'url': 'ClearMyMenu?aid=1071&outletid=13717&wechatid=osXr8jlCc84RfxtAgm0cxi-1Bl-Q&v=52dad443fe163b34522dd3c2ebd7f82a',
//                        'success': function (db) {
//                            $('#myorder').empty();
//                            $('#total').text('0');
//                        }
//                    });

//                }, null,
//                '取消', null, null,
//                null, true, true
//                );
//    }
    //

    

</script>

<script type="text/javascript">
    $(function () {
        $('#submit_form').click(function () {
            if (null == $('#tel').val().match(/^1\d{10,13}$/g)) {
                alert("请输入正确的手机号"); return false;
                MDialog.alert(null, "请输入正确的手机号", null, "确定");
                return false;
            }
            if ($("#guest_name").val() == '') {
                alert("请输入用户姓名"); return false;
                
            }
        });
    });
</script>
<script>
    $(document).ready(function () {
        $('#my_menu').click(function () {
            addToMenu();
        });


    });

</script>
<script>
    document.addEventListener('WeixinJSBridgeReady', function onBridgeReady() {
        WeixinJSBridge.call('hideToolbar');
    });
</script>
<iframe name="hide" style="display:none;"></iframe>

</body></html>